<!-- 推送明细查询 -->
<template>
    <el-dialog
        title="选择权限"
        v-model="visible"
        width="800px"
        top="5vh"
        append-to-body
    >
        <el-form :model="queryParams" ref="queryRef" :inline="true">
            <el-form-item label="查询条件" prop="name">
                <el-input
                    v-model="queryParams.name"
                    placeholder="请输入实体名称"
                    clearable
                    @keyup.enter="handleQuery"
                ></el-input>
            </el-form-item>
            <el-form-item label="状态" prop="state">
                <el-select
                    v-model="queryParams.state"
                    placeholder="数据状态"
                    clearable
                    style="width: 240px"
                >
                    <el-option
                        v-for="dict in sys_normal_disable"
                        :key="dict.value"
                        :label="dict.label"
                        :value="dict.value"
                    />
                </el-select>
            </el-form-item>
        </el-form>
        <!-- button area -->
        <el-row :gutter="20" class="mb8">
            <el-col :span="1.5">
                <el-button
                    type="primary"
                    plain
                    icon="Search"
                    @click="handleQuery"
                    >查询</el-button
                >
            </el-col>
        </el-row>
        <el-table
            :data="tableData"
            :loading="loading"
            @selection-change="handleSelectionChange"
            height="260px"
        >
            <el-table-column type="selection" width="55"></el-table-column>
            <el-table-column
                label="实体编码"
                align="center"
                prop="id"
                :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
                label="实体类型"
                align="center"
                prop="type"
                :show-overflow-tooltip="true"
            >
                <template #default="scope">
                    <dict-tag
                        :options="auth_entity_type"
                        :value="scope.row.type"
                    /> </template
            ></el-table-column>
            <el-table-column
                label="实体名称"
                align="center"
                prop="name"
                :show-overflow-tooltip="true"
                width="140"
            ></el-table-column>
            <el-table-column
                label="状态"
                align="center"
                prop="state"
                :show-overflow-tooltip="true"
            >
                <template #default="scope">
                    <dict-tag
                        :options="sys_normal_disable"
                        :value="scope.row.state"
                    />
                </template>
            </el-table-column>
            <el-table-column
                label="创建时间"
                align="center"
                prop="createTime"
                :show-overflow-tooltip="true"
                width="160"
            ></el-table-column>
        </el-table>
        <template #footer>
            <div class="dialog-footer">
                <el-button type="primary" @click="handleSelectAuth"
                    >确 定</el-button
                >
                <el-button @click="visible = false">取 消</el-button>
            </div>
        </template>
    </el-dialog>
</template>

<script setup name="SelectAuth">
import { reactive, ref, toRefs, getCurrentInstance } from 'vue'
const props = defineProps({
    groupId: {
        type: [Number, String]
    }
})
import { listByUnCond, authByGroup } from '@/api/system/auth'
const { proxy } = getCurrentInstance()
const { sys_normal_disable, auth_entity_type } = proxy.useDict(
    'sys_normal_disable',
    'auth_entity_type'
)

const data = reactive({
    form: {},
    tableData: [],
    queryParams: {
        name: '',
        state: '1',
        groupId: undefined
    },
    open: false,
    title: '',
    total: 0,
    rules: {}
})
const emit = defineEmits(['ok'])
const single = ref(true)
const multiple = ref(true)
const visible = ref(false)
const ids = ref([])
const authIds = ref([])
const { queryParams, tableData, open, title, form, total, rules } = toRefs(data)
const loading = ref(false)
function handleQuery() {
    getList()
}
// 多选框选中数据
function handleSelectionChange(selection) {
    authIds.value = selection.map((item) => item.id)
}
function getList() {
    loading.value = true
    listByUnCond(queryParams.value).then((res) => {
        loading.value = false
        tableData.value = res.data
    })
}
function handleSelectAuth() {
    const groupId = queryParams.groupId
    if (authIds.value.length < 1) {
        proxy.$modal.msgError('请选择要分配的权限')
        return
    }
    authByGroup({ groupId: groupId, authIds: authIds.value }).then((res) => {
        proxy.$modal.msgSuccess(res.msg)
        if (res.code === 200) {
            visible.value = false
            emit('ok')
        }
    })
}
function cancel() {}
function show() {
    queryParams.value.groupId = props.groupId
    getList()
    visible.value = true
}
function reset() {
    form.value = {
        id: undefined,
        name: '',
        type: '',
        state: '1'
    }
    proxy.resetForm('privRef')
}

defineExpose({
    show
})
</script>
<style scoped></style>
